<template>
	<div class="applyBox">
		<el-form :inline="true" :model="dataList.form" class="demo-form-inline" label-position="right" label-width="220px">
			<el-row>
				<el-col :span="12" v-if="trainingType === '高素质农民创业创新大赛'">
					<el-form-item label="单位名称:">
						<el-input v-model="dataList.form.deptName" placeholder="请输入单位名称" clearable />
			
					</el-form-item>
				</el-col>
				<el-col :span="12" v-if="trainingType === '高素质农民创业创新大赛'">
					<el-form-item label="项目名称:">
						<el-input v-model="dataList.form.projectName" placeholder="请输入项目名称" clearable />
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="姓名:">
						<el-input v-model="dataList.form.wxUserName" placeholder="请输入姓名" clearable />

					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="身份证:">
						<el-input v-model="dataList.form.certificateNumber" placeholder="请输入身份证号" clearable />
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="民族:">
						<el-select v-model="dataList.form.nation" placeholder="请选择性别" clearable>
							<el-option :label="nlist.name" :value="nlist.name" v-for="(nlist,i) in nation" />
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="生日:">
						<el-input v-model="dataList.form.birthday" placeholder="请输入生日(例:1995-01-20)" clearable />
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="性别:">
						<el-select v-model="dataList.form.gender" placeholder="请选择性别" clearable>
							<el-option :label="glist.name" :value="glist.value" v-for="(glist,i) in gender" />
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="户籍地址:">
						<el-input v-model="dataList.form.censusRegisterLocation" placeholder="请输入户籍地址" clearable />
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="产业岗位地区:">
						<el-cascader v-model="dataList.form.workLocation" :options="citys" @change="handleChange" />
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="文化程度:">
						<el-select v-model="dataList.form.educationLevel" placeholder="请选择文化程度" clearable>
							<el-option :label="education.itemValue" :value="education.itemValue" v-for="education in dataList.enroll_education_level" />
						</el-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="政治面貌:">
						<el-select  v-model="dataList.form.politicalType" placeholder="请选择政治面貌" clearable>
							<el-option :label="political.itemValue" :value="political.itemValue" v-for="political in dataList.enroll_political_type" />
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" v-if="trainingType === '高素质农民创业创新大赛'">
					<el-form-item label="项目经营主体性质:">
						<el-select v-model="dataList.form.projectManageMainstayType" placeholder="项目经营主体性质" clearable>
							<el-option :label="mainstay.itemValue" :value="mainstay.itemValue" v-for="mainstay in dataList.enroll_mainstay_type" />
						</el-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				
				<el-col :span="12" v-if="trainingType === '高素质农民创业创新大赛'">
					<el-form-item label="项目经营内容:">
						<el-select v-model="dataList.form.projectManageContent" placeholder="项目经营内容" clearable>
							<el-option :label="manage_content.itemValue" :value="manage_content.itemValue"  v-for="manage_content in dataList.enroll_manage_content" />
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="产业创办时间:">
						<el-date-picker v-model="dataList.form.industryEstablishmentTime" type="year" value-format="YYYY" placeholder="产业创办时间" />
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="2022年经营收入:">
						<el-input v-model="dataList.form.operatingIncome" placeholder="2022年经营收入(万元)" clearable />
					</el-form-item>
				</el-col>
				<el-col :span="12" v-if="trainingType === '高素质农民创业创新大赛'">
					<el-form-item label="是否参加过高素质农名培训:">
						<el-select v-model="dataList.form.siAttendHighQualityTraining" placeholder="是否新担任了村干部" clearable>
							<el-option label="是" :value="1" />
							<el-option label="否" :value="0" />
						</el-select>
					</el-form-item>
				</el-col>
				
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="是否辐射带动周边农民发展:">
						<el-select v-model="dataList.form.siDriveSurroundingDevelopment" placeholder="是否辐射带动周边农民发展" clearable>
							<el-option label="是" :value="1" />
							<el-option label="否" :value="0" />
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="带动户数:">
						<el-input v-model="dataList.form.driveHouseholds" placeholder="带动户数" clearable />
					</el-form-item>
				</el-col>
				
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="是否获得县级及以上荣誉或奖励:">
						<el-select v-model="dataList.form.siRewardsHonors" placeholder="是否获得县级及以上荣誉或奖励" clearable>
							<el-option label="是" :value="1" />
							<el-option label="否" :value="0" />
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" v-if="trainingType === '高素质农民创业创新大赛'">
					<el-form-item label="参赛选手身份:">
						<el-select v-model="dataList.form.contestantIdentity" placeholder="参赛选手身份" clearable>
							<el-option :label="contestant.itemValue" :value="contestant.itemValue" v-for="contestant in dataList.enroll_contestant_identity" />
						</el-select>
					</el-form-item>
				</el-col>
				

			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="本人获奖和受资助支持情况:">
						<el-input v-model="dataList.form.awardsAndSupport" placeholder="本人获奖和受资助支持情况" clearable />
					</el-form-item>
				</el-col>
			</el-row>
			
			<div v-for="(ind , idx) in dataList.industryInfoVoList">
				<p class="industry">主体产业：</p>
				<el-row>
					<el-col :span="12">
						<el-form-item label="产业名称:">
							<el-input v-model="ind.industryName" placeholder="产业名称" clearable />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="产业类型:">
							<el-select v-model="ind.industryType" placeholder="请选择产业类型" clearable>
								<el-option :label="industry.itemValue" :value="industry.itemValue" v-for="industry in dataList.enroll_industry_type" />
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="12">
						<el-form-item label="产业规模:">
							<el-input v-model="ind.industryScale" placeholder="请输入产业规模" clearable />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="产业规模单位:">
							<el-select v-model="ind.industryScaleType" placeholder="请选择产业规模单位" clearable>
								<el-option :label="scale_type.itemValue" :value="scale_type.itemValue" v-for="scale_type in dataList.enroll_industry_scale_type" />
							</el-select>
						</el-form-item>
						
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="12">
						<el-form-item label="年产值:">
							<el-input  v-model="ind.annualOutputValue" placeholder="年产值(万元)" clearable />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="年收入:">
							<el-input v-model="ind.annualIncome" placeholder="年收入(万元)" clearable />
						</el-form-item>
					</el-col>
				</el-row>
			</div>
		</el-form>
		<div class="tabBtn">
			<button class="tabBtn_add" @click="addIndustry">添加产业</button>
			<button class="tabBtn_del" @click="delIndustry">删除产业</button>
		</div>
		<div class="submitBtn">
			<button class="btnS" @click="submitForm">提交</button>
		</div>
	</div>
</template>

<script setup lang="ts">
	import{ searchByCode ,enrollTraining} from '../api/home.js'
	import { nation, gender, citys, areas, yesAndNo} from './constant'
	import {
		useRouter
	} from 'vue-router'
	import {
		onBeforeMount,
		reactive,
		ref
	} from 'vue'
	const value = ref([])
	const props = {
	  expandTrigger: 'hover' as const,
	}
	
	const handleChange = (value) => {
	  console.log(value,"9999999999”")
	}
	const list = defineProps({
		type:String,
		id:String,
		trainingType:String
	})
	// boolean
	const router = useRouter()
	const size = ref('default')
	const dataList = reactive({
		disabled:true,
		type: 1,
		industryInfoVoList: [{
			industryType: '',
			industryName: '',
			industryScale: '',
			industryScaleType: '',
			annualOutputValue: '',
			annualIncome: ''
		}],
		enroll_source:[],
		enroll_training_needs:[],
		enroll_education_level:[],
		enroll_political_type:[],
		enroll_personnel_category:[],
		enroll_industry_type:[],
		enroll_base_info:[],
		enroll_industry_scale_type:[],
		enroll_contestant_identity:[],
		enroll_mainstay_type:[],
		enroll_manage_content:[],
		form:{
			deptName:'',
			projectName:'',
			wxUserName: '',
			certificateNumber: '',
			nation: '',
			birthday: '',
			gender: '',
			censusRegisterLocation: '',
			workLocation: '',
			educationLevel: '',
			projectManageMainstayType:'',
			projectManageContent:'',
			politicalType:'',
			industryEstablishmentTime: '',
			operatingIncome: '',
			siAttendHighQualityTraining:'',
			siDriveSurroundingDevelopment: '',
			driveHouseholds: '',
			siRewardsHonors: '',
			contestantIdentity:'',
			awardsAndSupport: ''
		}
		
	})
	onBeforeMount(() => {
		dataList.type = router.currentRoute.value.query.type
		getTab('enroll_training_needs')
		getTab('enroll_source')
		getTab('enroll_education_level')
		getTab('enroll_political_type')
		getTab('enroll_personnel_category')
		getTab('enroll_industry_type')
		getTab('enroll_base_info')
		getTab('enroll_industry_scale_type')
		getTab('enroll_contestant_identity')
		getTab('enroll_mainstay_type')
		getTab('enroll_manage_content')
		if(list.type == 'user'){
			getList()
		}
	})
	const onSubmit = () => {
		console.log('submit!')
	}
	const addIndustry = () => {
		var list = {
			industryType: '',
			industryName: '',
			industryScale: '',
			industryScaleType: '',
			annualOutputValue: '',
			annualIncome: ''
		}
		dataList.industryInfoVoList.push(list)
	}
	const delIndustry = () => {
		if (dataList.industryInfoVoList.length > 1) {
			dataList.industryInfoVoList.pop()
		}

	}
	
	const getTab = (type) => {
		var data = {
			params: type
		}
		searchByCode(data).then(res=> {
			dataList[type] = res.data
		})
	}
	const submitForm = () => {
		console.log(list.id)
		// return false
		var lists = {
			industryType: '',
			industryName: '',
			industryScale: '',
			industryScaleType: '',
			annualOutputValue: '',
			annualIncome: ''
		}
		var data = {
			params: {
				trainingUuid: list.id,
				wxUserUuid: localStorage.getItem('userUuid'),
			  deptName:dataList.form.deptName,
			  projectName:dataList.form.projectName,
			  wxUserName: dataList.form.wxUserName,
			  certificateNumber: dataList.form.certificateNumber,
			  nation: dataList.form.nation,
			  birthday: dataList.form.birthday,
			  gender: dataList.form.gender,
			  censusRegisterLocation: dataList.form.censusRegisterLocation,
			  workLocation: dataList.form.workLocation[0]+dataList.form.workLocation[1] +dataList.form.workLocation[2],
			  educationLevel: dataList.form.educationLevel,
			  projectManageMainstayType:dataList.form.projectManageMainstayType,
			  projectManageContent:dataList.form.projectManageContent,
			  politicalType: dataList.form.politicalType,
			  industryEstablishmentTime: dataList.form.industryEstablishmentTime,
			  operatingIncome: dataList.form.operatingIncome,
			  siDriveSurroundingDevelopment: dataList.form.siDriveSurroundingDevelopment,
			  driveHouseholds: dataList.form.driveHouseholds,
			  siRewardsHonors: dataList.form.siRewardsHonors,
			  siAttendHighQualityTraining:dataList.form.siAttendHighQualityTraining,
			  contestantIdentity:dataList.form.contestantIdentity,
			  awardsAndSupport: dataList.form.awardsAndSupport,
			  industryInfoVoList:dataList.industryInfoVoList
			}
		}
		if(data.params.industryInfoVoList.length == 1){
			data.params.industryInfoVoList.push(lists)
			data.params.industryInfoVoList.push(lists)
		}
		enrollTraining(data).then(res=> {
			if(res.code == 200){
				ElMessage({
					message: res.msg,
					type: 'success',
				})
						router.back()
			}else{
				ElMessage({
					message: res.msg,
					type: 'error',
				})
			}
		})
	}
	// 
</script>

<style lang="scss" scoped>
	.applyBox {
		width: 1200px;
		margin: 30px auto;
		padding: 60px 30px 30px 30px;
		background: #FFFFFF;
		border-radius: 10px;
		border: 1px solid rgba(17, 145, 142, 0.2);
		position: relative;
	}
	.isuser{
		width: 900px;
	}
	.industry {
		width: 220px;
		text-align: right;
		font-size: 14px;
		color: #333333;
		font-weight: 400;
		margin-bottom: 20px;
	}
	.tabBtn{
		margin: 30px 0;
		button{
			font-size: 16px;
			font-weight: 400;
			width: 152px;
			height: 37px;
			border-radius: 100px 100px 100px 100px;
			background-color: #FFFFFF;
			margin-right: 20px;
		}
		&_add{
			color: #11918E;
			border: 1px solid #11918E;
		}
		&_del{
			color: #D10202;
			border: 1px solid #D10202;
		}
	}
	.submitBtn{
		width: 100%;
		display: flex;
		justify-content: center;
		button{
			width: 152px;
			height: 37px;
			background: #11918E;
			border-radius: 100px 100px 100px 100px;
		}
	}
	:deep(.el-form-item__label) {
		color: #333333;
	}

	
	.isuser{
		width: 900px;
		:deep(.el-input__wrapper) {
			width: 200px;
		
		}
	}
</style>